<!--留言-->


<template>
  <div>

    <label>服务器:</label>
    <p>
      内容信息:{{ clientData }}
    </p>
    <el-input v-model="ServerData" placeholder="请输入关键字或详细内容"></el-input>
    <button @click="LoadServer">启动服务器</button>
    <button @click="sendData">发送数据给客户端</button>
    <button @click="ReceiveData">接收到的客户端数据</button>
  </div>
</template>
<script>
import axios from "axios";

export default {
  name: "MessageBoard",
  data() {
    return {
      ServerData: '',
      clientData: ''
    }
  },

  methods: {
    LoadServer() {
      console.log("连接中!");
      axios.get('http://localhost:9996/network/ServiceLoad', null, false).then((res) => {
        console.log(res);
        // this.clientData = res.data;
        this.ReceiveData()
        alert("连接成功!")
      }).catch(error => {
        console.log(error)
        return;
      })
    },
    sendData() {
      // this.ReceiveData();
      console.log("发送信息!");
      this.params={
        msg:this.ServerData
      }
      axios.post('http://localhost:9996/network/ServiceSend', this.params).then((res) => {
        // console.log(res.data);
        this.clientData = res.data.word;
        alert("发送成功!")
      }).catch(error => {
        console.log(error)
        return;
      })
    },
    ReceiveData() {
      console.log("接收数据!");
        axios.get('http://localhost:9996/network/ReceiveMsg', null, false).then((res) => {
        console.log(res);
         this.clientData = res.data.word;
      }).catch(error => {
        console.log(error)
        return;
      })
    }
  }
}
</script>
<style scoped>

</style>



